<!-- Content Header (Page header) -->
<section class="content-header">
    <h1>
        Account
        <small>Account Detail</small>
    </h1>
    <ol class="breadcrumb">
        <li><a ui-sref="main.dashboard"><i class="fa fa-dashboard"></i> Dashboard</a>
        </li>
        <li><a ui-sref="main.account">Account</a>
        </li>
        <li class="active">Mike Doe</li>
    </ol>
</section>

<!-- Main content -->
<section class="content">
    <div class="nav-tabs-custom" bs-tabs>
        <!-- use data-title instead of title attribute to avoid the default browser behavior of title -->
        <div data-title="<i class='fa fa-user'></i> Profile" bs-pane>
          <div class="tab-pane active" id="profile">
                <!-- title row -->
                <div class="row">
                    <div class="col-xs-12">
                        <h2 class="page-header">
                            <i class="fa fa-user"></i> Mike Doe
                            <small class="pull-right">Last Update Date: 2/10/2014</small>
                        </h2>
                    </div>
                    <!-- /.col -->
                </div>

                <div class="row">
                    <div class="col-sm-12">
                        <dl class="dl-horizontal">
                            <dt class="text-muted">Status:</dt>
                            <dd><span class="label label-success">Approved</span></dd>
                            <dt class="text-muted">Account Owner:</dt>
                            <dd>Toto Lara</dd>
                            <dt class="text-muted">Type:</dt>
                            <dd>Account</dd>
                            <dt class="text-muted">Parent Account:</dt>
                            <dd>Joly Hdy</dd>
                            <dt class="text-muted">Website:</dt>
                            <dd>www.example.com</dd>
                            <dt class="text-muted">Phone:</dt>
                            <dd>(804) 123-5432</dd>
                            <dt class="text-muted">Industry:</dt>
                            <dd>E-Commercial</dd>
                            <dt class="text-muted">Description:</dt>
                            <dd>Etsy doostang zoodles disqus groupon greplin oooj voxy zoodles, weebly ning heekya handango imeem plugg dopplr jibjab</dd>
                        </dl>
                    </div>
                    <!-- /.col -->
                </div>
                <!-- /.row -->

                <div class="row">
                    <div class="col-sm-6">
                        <p class="lead"><i class="fa fa-credit-card"></i> Billing Address</p>
                        <dl class="dl-horizontal">
                            <dt class="text-muted">Country:</dt>
                            <dd>China</dd>
                            <dt class="text-muted">Postal Code:</dt>
                            <dd>123456</dd>
                            <dt class="text-muted">State/Province:</dt>
                            <dd>Guangdong</dd>
                            <dt class="text-muted">City:</dt>
                            <dd>Shenzhen</dd>
                            <dt class="text-muted">Street:</dt>
                            <dd>Etsy doostang zoodles disqus groupon greplin oooj voxy zoodles</dd>
                        </dl>
                    </div>
                    <!-- /.col -->
                    <div class="col-sm-6">
                        <p class="lead"><i class="fa fa-truck"></i> Shipping Address</p>
                        <dl class="dl-horizontal">
                            <dt class="text-muted">Country:</dt>
                            <dd>China</dd>
                            <dt class="text-muted">Postal Code:</dt>
                            <dd>123456</dd>
                            <dt class="text-muted">State/Province:</dt>
                            <dd>Guangdong</dd>
                            <dt class="text-muted">City:</dt>
                            <dd>Shenzhen</dd>
                            <dt class="text-muted">Street:</dt>
                            <dd>Etsy doostang zoodles disqus groupon greplin oooj voxy zoodles</dd>
                        </dl>
                    </div>
                    <!-- /.col -->
                </div>

                <div class="row">
                    <div class="col-sm-12">
                        <p class="lead"><i class="fa fa-phone-square"></i> Contacts</p>
                        <table class="table table-striped footable" data-sort="false">
                            <thead>
                                <tr>
                                    <th>Name</th>
                                    <th>Email</th>
                                    <th data-hide="phone">Phone</th>
                                    <th>Mobile</th>
                                    <th data-hide="phone">Fax</th>
                                    <th data-hide="phone">Address</th>
                                </tr>
                            </thead>
                            <tbody>
                                <tr>
                                    <td>Call of Duty</td>
                                    <td>example@example.com</td>
                                    <td>455-981-221</td>
                                    <td>455-981-221</td>
                                    <td>455-981-221</td>
                                    <td>El snort testosterone trophy driving gloves handsome</td>
                                </tr>
                                <tr>
                                    <td>Need for Speed IV</td>
                                    <td>example@example.com</td>
                                    <td>455-981-221</td>
                                    <td>455-981-221</td>
                                    <td>247-925-726</td>
                                    <td>Wes Anderson umami biodiesel</td>
                                </tr>
                                <tr>
                                    <td>Monsters DVD</td>
                                    <td>example@example.com</td>
                                    <td>455-981-221</td>
                                    <td>455-981-221</td>
                                    <td>735-845-642</td>
                                    <td>Terry Richardson helvetica tousled street art master</td>
                                </tr>
                                <tr>
                                    <td>Grown Ups Blue Ray</td>
                                    <td>example@example.com</td>
                                    <td>455-981-221</td>
                                    <td>455-981-221</td>
                                    <td>422-568-642</td>
                                    <td>Tousled lomo letterpress</td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                </div>

                <!-- this row will not appear when printing -->
                <div class="row no-print">
                    <div class="col-xs-12">
                        <button class="btn btn-sm btn-default" onclick="window.print();"><i class="fa fa-print"></i> Print</button>
                        <button class="btn btn-sm btn-primary pull-right"><i class="fa fa-download"></i> Generate PDF</button>
                    </div>
                </div>
            </div>
        </div>
        <div data-title="<i class='fa fa-rss'></i> Activity" bs-pane>Activity</div>
        <div data-title="<i class='fa fa-shopping-cart'></i> Opportunity" bs-pane>Opportunity</div>
        <div data-title="<i class='fa fa-ticket'></i> Order" bs-pane>Order</div>
        <div data-title="<i class='fa fa-info'></i> Note &amp; Attachment" bs-pane>Note &amp; Attachment</div>

    </div>
</section>
